<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>编辑信息</title>
    <link href="../../static/Hunter/css/Hunter/infoEditor.css" rel="stylesheet" type="text/css" data-th-href="@{/Hunter/css/Hunter/infoEditor.css}" />
    <script src="../../static/Hunter/js/JQuery.js" data-th-src="@{/Hunter/js/JQuery.js}"></script>
    <style type="text/css">
    body{
    	background: rgba(35, 118, 254, 0.52);
    }
    body>div{
    	float: left;
    	width: 50%;
    	height: 250%; 
    	margin-left: 25%;
    }
    </style>
</head>
<body>
    <div>
    	<h2 style="margin: 5px 38%;">请完善个人信息</h2>
        <form action="http://www.baidu.com" data-th-action="@{/hunter/insert}" method="post">
            <p><span>　姓　　名　</span>　<input required type="text" name="jName"></p>
            <p><span>　出生日期　</span>　<input required id="birth" type="date" name="jBirth"></p>
            <p><span>　性　　别　</span>　
                <input  class="sex" type="radio" name="jSex" value="0" checked="checked">　男
                <input  class="sex" type="radio" name="jSex" value="1">　女
            </p>
            <p id="email_p"><span>　邮　　箱　</span>　<input id="email" required type="text" name="jEmail" ><span id="email_info"></span></p>
            <p><span>　学　　校　</span>　
                <input id="schoolName" required type="text" autocomplete="off" name="jSchool" list="schoolNameList" >
                <datalist id="schoolNameList"></datalist>
            </p>
            <p><span>　专　　业　</span>　
                <input id="majorName" required type="text" autocomplete="off" name="jMajor" list="majorNameList">
                <datalist id="majorNameList"></datalist>
            </p>
            <p><span>　入学时间　</span>　<input type="date" required id="entryTime" name="entryTime"></p>
            <p><span>　毕业时间　</span>　<input type="date" required id="graduateTime" name="graduateTime" ></p>
            <p class="experience"><span>　校园经历　</span>　<textarea name="jExperience"></textarea> </p>
            <p id="address_p"><span>&nbsp;&nbsp;籍　　贯&nbsp;&nbsp;</span>　
                <select id="province" name="province">
                </select>
                <select id="city" name="city">
                    <option>北京市</option>
                </select>
            </p>
            <p><span id="55">　求职意向　</span>　
            	<input id="jobName" type="text" required autocomplete="off" name="jJob" list="jobNameList">
                <datalist id="jobNameList"></datalist>
            </p>
            <p><span>　学　　历　</span>　
            	<select name="jEducation">
            		<option>博士</option>
            		<option>硕士</option>
            		<option>本科</option>
            		<option>专科</option>
            	</select>
            </p>
            <p class="skill"><span>　个人技能　</span>　<textarea placeholder="如java" required name="jSkill"></textarea></p>
            <p id="salary_p"><span>　薪　　资　</span>　<input id="salary" required type="text" name="jSalary" ><span id="salary_info"></span></p>
            <p><span>　base 地　</span> 　
            	<input id="baseName" type="text" required autocomplete="off" name="jBase" list="baseNameList">
                <datalist id="baseNameList"></datalist>
            </p>
            <p class="sub" style="position: absolute;left: 22%;top: 130%;margin-bottom: 5%"><input class="submit" type="submit" value="提交"><span id="info"></span></p>

        </form>
    </div>
</body>
<script data-th-inline="javascript">
    jQuery.noConflict();
    jQuery(function () {
		
		//邮箱
		function verifyEmail() {
			jQuery("#email_p").delegate("#email","propertychange input",function(){
				let email = jQuery("#email").val();
				console.log(email);
	            let reg = /^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/;
	            if(!reg.test(email)){
	                jQuery("#email_info").text("邮箱格式有误,提交按钮已禁用!");
	                jQuery("#email_info").css({
	                            "color": "#ff0011",
	                            "font-size":"12px",
	                            "position":"absolute",
	                            "top":"-20%",
	                            "left":"40%",
	                            "display":"inline-block",
	                            "height":"20px",
	                            "line-height":"20px",
	                            "border":"1px solid black"
	                        }
	                );
	               jQuery(".submit").attr("disabled","true");
	            }else{
	            	jQuery(".submit").removeAttr("disabled");
	            	jQuery("#email_info").text("");
	            	jQuery("#email_info").css({"border":"none"});
	            }
			});
        };
		jQuery("#email").on("focus",verifyEmail);

		//薪资
		function verifySalary(){
			jQuery("#salary_p").delegate("#salary","propertychange input",function(){
				var salary = jQuery("#salary").val();
				if(isNaN(salary)){
					jQuery("#salary_info").text("含有非数字字符,提交按钮已禁用!");
	                jQuery("#salary_info").css({
	                            "color": "#ff0011",
	                            "font-size":"12px",
	                            "position":"absolute",
	                            "top":"-20%",
	                            "left":"40%",
	                            "display":"inline-block",
	                            "height":"20px",
	                            "line-height":"20px",
	                            "border":"1px solid black"
	                        }
	                );
	               jQuery(".submit").attr("disabled","true");
				}else{
					jQuery(".submit").removeAttr("disabled");
	            	jQuery("#salary_info").text("");
	            	jQuery("#salary_info").css({"border":"none"});
				}
			});
		};
		jQuery("#salary").on("focus",verifySalary);
		
		//省份
    	jQuery.ajax(
                {
                    type:'GET',
                    url:'/hunter/province',
                    success:function(data){
                    	jQuery("#province option").remove();
                    	for(var i in data){
                    		
                    		var html = "";
    						html="<option value='"+data[i].provincialID+"'>"+data[i].provincialName+"</option>"
                    		jQuery("#province").append(html);
                    	}
                    }
                }
        );

		//城市
		jQuery("#province").change(function(){
			let provincialID = jQuery(this).find("option:selected").attr("value");
			
			jQuery.ajax({
				type:'GET',
				url:'/hunter/city',
				data:{
					provincialID:provincialID
				},
				dataType:'json',
				success:function(data){
					jQuery("#city option").remove();
					for(var i in data){
						html="<option>"+data[i].cityName+"</option>"
						jQuery("#city").append(html);
					}
				}
			});
		});
		
        //学校
        jQuery('#schoolName').keyup(function(e) {
            var e = e || window.event;
            if(e.keyCode==32 ||	
                    e.keyCode==49 ||
                    e.keyCode==50 ||
                    e.keyCode==51 ||
                    e.keyCode==52 ||
                    e.keyCode==53 ||
                    e.keyCode==54 ||
                    e.keyCode==55 ||
                    e.keyCode==56 ||
                    e.keyCode==57 ||
                    e.keyCode==48
            ){
                jQuery("#schoolNameList option").remove();
                jQuery.ajaxSetup({async: true});
                jQuery.get("/hunter/school", {'schoolName' : jQuery("#schoolName").val() == "" ? null : jQuery("#schoolName").val()}, function(data) {
                    for(var i in data) {
                        var html = "";
                        html += "<option value='" + data[i].schoolName + "' data-schoolId='" + data[i].schoolId + "'></option>";
                        jQuery("#schoolNameList").append(html);
                    }
                }, "json")
            }
        });
        
        //专业
        jQuery('#majorName').keyup(function(e) {
            var e = e || window.event;
            if(e.keyCode==32 ||
                    e.keyCode==49 ||
                    e.keyCode==50 ||
                    e.keyCode==51 ||
                    e.keyCode==52 ||
                    e.keyCode==53 ||
                    e.keyCode==54 ||
                    e.keyCode==55 ||
                    e.keyCode==56 ||
                    e.keyCode==57 ||
                    e.keyCode==48
            ){
                jQuery("#majorNameList option").remove();
                jQuery.ajaxSetup({async: true});
                jQuery.get("/hunter/major", {'majorName' : jQuery("#majorName").val() == "" ? null : jQuery("#majorName").val()}, function(data) {
                    for(var i in data) {
                        var html = "";
                        html += "<option value='" + data[i].majorName + "' data-schoolId='" + data[i].majorId + "'></option>";
                        jQuery("#majorNameList").append(html);
                    }
                }, "json")
            }
        });
        
        //base地
        jQuery('#baseName').keyup(function(e) {
            var e = e || window.event;
            if(e.keyCode==32 ||
                    e.keyCode==49 ||
                    e.keyCode==50 ||
                    e.keyCode==51 ||
                    e.keyCode==52 ||
                    e.keyCode==53 ||
                    e.keyCode==54 ||
                    e.keyCode==55 ||
                    e.keyCode==56 ||
                    e.keyCode==57 ||
                    e.keyCode==48
            ){
                jQuery("#baseNameList option").remove();
                jQuery.ajaxSetup({async: true});
                jQuery.get("/hunter/base", {'cityName' : jQuery("#baseName").val() == "" ? null : jQuery("#baseName").val()}, function(data) {
                    for(var i in data) {
                        var html = "";
                        html += "<option value='" + data[i].cityName + "' data-baseId='" + data[i].cityID + "'></option>";
                        jQuery("#baseNameList").append(html);
                    }
                }, "json")
            }
        });
        
        //求职意向
        jQuery('#jobName').keyup(function(e) {
            var e = e || window.event;
            if(e.keyCode==32 ||
            		e.keyCode==8 ||
            		e.keyCode==13 ||
            		e.keyCode==16 ||
                    e.keyCode==49 ||
                    e.keyCode==50 ||
                    e.keyCode==51 ||
                    e.keyCode==52 ||
                    e.keyCode==53 ||
                    e.keyCode==54 ||
                    e.keyCode==55 ||
                    e.keyCode==56 ||
                    e.keyCode==57 ||
                    e.keyCode==48
            ){
                jQuery("#jobNameList option").remove();
                jQuery.ajaxSetup({async: true});
                jQuery.get("/hunter/job", {'jName' : jQuery("#JobName").val() == "" ? null : jQuery("#jobName").val()}, function(data) {
                    for(var i in data) {
                        var html = "";
                        html += "<option value='" + data[i].jname + "' data-baseId='" + data[i].jId + "'></option>";
                        jQuery("#jobNameList").append(html);
                    }
                }, "json")
            }
        });
        
    });
</script>
</html>